<template>
    <view>
        <view class="weui-navbar flex1">
            <view @tap="tabClick" :class="'weuiitem ' + (activeIndex == index ? 'weui-bar__item_on' : '')" :id="index" v-for="(item, index) in tabs" :key="index">
                <view :style="'color:' + (activeIndex == index ? color : '')">{{ item }}</view>
            </view>
            <view
                class="weui-navbar__slider"
                :style="
                    'left: ' +
                    sliderLeft +
                    'px; transform: translateX(' +
                    sliderOffset +
                    'px); -webkit-transform: translateX(' +
                    sliderOffset +
                    'px);background-color:' +
                    color +
                    ';'
                "
            ></view>
        </view>
        <view class="ppxlb" v-if="activeIndex == 0">
            <view class="ppxlbhdwz">今日手速王</view>
            <view class="pxlbhd">
                <image class="ab bgimg" mode="widthFix" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/onebgimg.png"></image>
                <image class="ab udlr tximg" :src="ranklist[0].img"></image>
            </view>
            <view class="ppxlbbdwz">{{ ranklist[0].name }}</view>
            <view class="ppxlbbdwz1" :style="'color:' + color">今天 {{ ranklist[0].time3 }}</view>
            <view class="pmlist" v-if="index > 0" v-for="(item, index) in ranklist" :key="index">
                <image class="pximg" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/yingpai@2x.png" v-if="index == 1"></image>

                <image class="pximg" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/jiangpai@2x.png" v-if="index == 2"></image>

                <view class="pximg" v-if="index > 2">{{ index + 1 }}</view>

                <image class="nctximg" :src="item.img"></image>

                <view class="ncname">{{ item.name }}</view>

                <view class="qdtiem" :style="'color:' + color">今天 {{ item.time3 }}</view>
            </view>
            <view class="jzz" v-if="refresh_top == false && ranklist.length != 0">
                <image class="Rotation" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/jzz.png"></image>
                <view>加载中...</view>
            </view>
            <view class="jzwb" v-if="refresh_top == true && ranklist.length != 0">
                <view class="hx"></view>
                <view class="wz">加载完毕</view>
                <view class="hx"></view>
            </view>
        </view>
        <view class="ppxlb" v-if="activeIndex == 1">
            <view class="ppxlbhdwz">签到总榜</view>
            <view class="pxlbhd">
                <image class="ab bgimg" mode="widthFix" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/onebgimg.png"></image>
                <image class="ab udlr tximg" :src="zrank[0].img"></image>
            </view>
            <view class="ppxlbbdwz">{{ zrank[0].name }}</view>
            <view class="ppxlbbdwz1" :style="'color:' + color">累计签到{{ zrank[0].day }}次</view>
            <view class="pmlist" v-if="index > 0" v-for="(item, index) in zrank" :key="index">
                <image class="pximg" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/yingpai@2x.png" v-if="index == 1"></image>

                <image class="pximg" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/jiangpai@2x.png" v-if="index == 2"></image>

                <view class="pximg" v-if="index > 2">{{ index + 1 }}</view>

                <image class="nctximg" :src="item.img"></image>

                <view class="ncname">{{ item.name }}</view>

                <view class="qdtiem" :style="'color:' + color">累计签到{{ item.day }}次</view>
            </view>
            <view class="jzz" v-if="refresh_top1 == false && zrank.length != 0">
                <image class="Rotation" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/jzz.png"></image>
                <view>加载中...</view>
            </view>
            <view class="jzwb" v-if="refresh_top1 == true && zrank.length != 0">
                <view class="hx"></view>
                <view class="wz">加载完毕</view>
                <view class="hx"></view>
            </view>
        </view>
        <view class="grxxt" v-if="activeIndex == 0">
            <image :src="userinfo.img"></image>
            <view class="grxxtbd">
                <view class="qd" :style="'color:' + color">今天{{ MyRank.time3 }}</view>
                <view>累计{{ userinfo.day }}次，连续签到{{ lxts }}天</view>
            </view>
            <view @tap="qqd" class="grxxtft">排行{{ MyRank.num }}</view>
        </view>
    </view>
</template>

<script>
import cardlist from '@/ymq_canyino2o/dist/cardlist/index';
import gettel from '@/ymq_canyino2o/dist/gettel/index';
var app = getApp();
var util = require('../../utils/util.js');
export default {
    components: {
        cardlist,
        gettel
    },
    data() {
        return {
            tabs: ['手速榜', '总榜'],
            activeIndex: 0,
            sliderOffset: 0,
            sliderLeft: 15,
            refresh_top: false,
            refresh_top1: false,
            rankpage: 1,
            zrankpage: 1,
            sranklist: [],
            szrank: [],

            userinfo: {
                img: '',
                day: ''
            },

            lxts: '',

            MyRank: {
                time3: '',
                num: ''
            },

            ranklist: '',
            zrank: '',
            color: '',
            img: '',
            name: '',
            time3: '',
            day: ''
        };
    },
    onLoad: function (a) {
        app.globalData.setNavigationBarColor(this);
        var that = this;
        var e = uni.getStorageSync('users').id;
        app.globalData.util.request({
            url: 'entry/wxapp/userinfo',
            cachetime: '0',
            data: {
                user_id: e
            },
            success: function (a) {
                console.log('个人信息', a);
                that.setData({
                    userinfo: a.data
                });
            }
        });
        app.globalData.util.request({
            url: 'entry/wxapp/Continuous',
            cachetime: '0',
            data: {
                user_id: e
            },
            success: function (a) {
                console.log('查看连续签到天数', a);
                that.setData({
                    lxts: a.data
                });
            }
        });
        app.globalData.util.request({
            url: 'entry/wxapp/MyJrRank',
            cachetime: '0',
            data: {
                user_id: e
            },
            success: function (a) {
                console.log('MyJrRank', a.data);
                a.data.time3 = util.ormatDate(a.data.time3).substring(11);
                that.setData({
                    MyRank: a.data
                });
            }
        });
        this.rank();
        this.zrankFun();
    },
    onReady: function () {},
    onShow: function () {},
    onHide: function () {},
    onUnload: function () {},
    onPullDownRefresh: function () {},
    onReachBottom: function () {
        console.log('上拉加载', this.activeIndex, this.rankpage, this.zrankpage);
        if (0 == this.refresh_top && 0 == this.activeIndex) {
            this.rank();
        } else {
            console.log('今日没有了');
        }
        if (0 == this.refresh_top1 && 1 == this.activeIndex) {
            this.zrankFun();
        } else {
            console.log('总的没有了');
        }
    },
    methods: {
        tabClick: function (a) {
            console.log(a);
            this.setData({
                sliderOffset: a.currentTarget.offsetLeft,
                activeIndex: a.currentTarget.id
            });
        },

        rank: function () {
            var that = this;
            var s = (uni.getStorageSync('users').id, that.rankpage);
            var a = that.zrankpage;
            var n = that.sranklist;
            var t = that.szrank;
            console.log(s, a, n, t);
            app.globalData.util.request({
                url: 'entry/wxapp/JrRank',
                cachetime: '0',
                data: {
                    page: s,
                    pagesize: 20
                },
                success: function (a) {
                    for (var t in (console.log('JrRank', a.data),
                    console.log(a),
                    that.setData({
                        rankpage: s + 1
                    }),
                    a.data.length < 20
                        ? that.setData({
                              refresh_top: true
                          })
                        : that.setData({
                              refresh_top: false
                          }),
                    a.data)) {
                        a.data[t].time3 = util.ormatDate(a.data[t].time3).substring(11);
                    }
                    n = n.concat(a.data);
                    console.log(n);
                    that.setData({
                        ranklist: n,
                        sranklist: n
                    });
                }
            });
        },

        zrankFun: function () {
            var that = this;
            var a = (uni.getStorageSync('users').id, that.rankpage);
            var e = that.zrankpage;
            var s = that.sranklist;
            var n = that.szrank;
            console.log(a, e, s, n);
            app.globalData.util.request({
                url: 'entry/wxapp/Rank',
                cachetime: '0',
                data: {
                    page: e,
                    pagesize: 20
                },
                success: function (a) {
                    console.log('rank', a);
                    console.log(a);
                    that.setData({
                        zrankpage: e + 1
                    });
                    if (a.data.length < 20) {
                        that.setData({
                            refresh_top1: true
                        });
                    } else {
                        that.setData({
                            refresh_top1: false
                        });
                    }
                    n = n.concat(a.data);
                    console.log(n);
                    that.setData({
                        zrank: n,
                        szrank: n
                    });
                }
            });
        },

        qqd() {
            console.log('占位：函数 qqd 未声明');
        }
    }
};
</script>
<style>
@import './pm.css';
</style>
